<html>
  <head>
	<title>Facebook / Map Mashup</title>
	<script src="http://www.google.com/uds/api?file=uds.js&v=1.0&key=ABQIAAAAYgIFcdB73ikjsshF47qFhRT9MMXG_tYPVLibiAtjK-zmIeBb9RTQy57sFP4wbxEGLiuFm3mV7BVEKQ"      type="text/javascript"></script>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAYgIFcdB73ikjsshF47qFhRT9MMXG_tYPVLibiAtjK-zmIeBb9RTQy57sFP4wbxEGLiuFm3mV7BVEKQ"       type="text/javascript"></script>
<script src="http://www.google.com/uds/solutions/localsearch/gmlocalsearch.js" type="text/javascript"></script>	
	<style type="text/css">		  @import url("http://www.google.com/uds/css/gsearch.css");		  @import url("http://www.google.com/uds/solutions/localsearch/gmlocalsearch.css");
    		  .style1 {background-color:#ffffff;font-weight:bold;border:2px #006699 solid;}

    	</style>



    	<script type="text/javascript">

      	google.load("maps", "2");

      	google.load("search", "1");

	var over;
	var map;
	var points;
	var searcher;


      // Call this function when the page has been loaded
      	function initialize() {
      	  	map = new google.maps.Map2(document.getElementById("map"));
		over = new GGeoXml("campus.kml");
		search = (new google.maps.LocalSearch(), new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,20)));
		map.addOverlay(over);

        	map.addControl(new GLargeMapControl());
        	map.addControl(new GMapTypeControl());
        	var searchControl = new google.search.SearchControl();
         	 map.addControl(new GLocalSearch(), new 	GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(10,20)));
		map.addControl(searcher);

		if (window.ActiveXObject) {
  			parser=new ActiveXObject("Microsoft.XMLDOM");
  			parser.async=false;
  			parser.load("campus.kml");
  		}
		// code for Mozilla, Firefox, Opera, etc.
		else if (document.implementation && document.implementation.createDocument) {
        		parser = new XMLHttpRequest();
			parser.open( "GET", "campus.kml", false );
			parser.send(null);
		 	parser = parser.responseXML;
  		}
		else {
  			alert('Your browser cannot handle this script.  Please use Firefox or Internet Explorer');
  		}
		/*
    		if( !window.ActiveXObject )
      		{

			parser.open( "GET", "campus.kml", false );
			parser.send(null);
		 	parser = parser.responseXML;
      		}
		else
      		{
        	 	parser = new ActiveXObject("Microsoft.XMLDOM");
		 	parser.async = false;
			parser.load("campus.kml");
      		} */
		points = parser.getElementsByTagName( "name" );
		var i; var add_to_menu="<select name = 'selector' id = 'selector' onChange='setStatus();'><option value ='none'>--Choose Building--</option>";
		for (i=0;i<points.length;i++) {
			add_to_menu +="<option value = '"+points.item(i).firstChild.nodeValue+"'>"+points.item(i).firstChild.nodeValue+"</option>";
		}
		add_to_menu+="</select>";
	
		document.getElementById("side_bar").innerHTML=add_to_menu;	
	}

	// For changing the dynamic text area
	function setStatus(mystring) {
		

		var coords = parser.getElementsByTagName( "coordinates" );
		var mycoords = coords.item(document.getElementById("selector").selectedIndex-1).firstChild.nodeValue.split(",");

		var descs = parser.getElementsByTagName( "description" );
		
		var point = new GLatLng(mycoords[1], mycoords[0]);
		var myHtml = "<font face=\"Lucida Grande\"><b>" + document.getElementById("selector").value + "</b><br><font size = -1>" + descs.item(document.getElementById("selector").selectedIndex-1).firstChild.nodeValue + "</font></font>";
 		map.openInfoWindow(point, myHtml);
		
		document.getElementById("status").innerHTML=document.getElementById("selector").value+" "+descs.item(document.getElementById("selector").selectedIndex-1).firstChild.nodeValue;
	}

	// For linking the calendar to the map
	function buildingLink(mystring, myevent, mydesc) {
		var match;
		for (var i=0;i<points.length;i++) {
			if (mystring == points.item(i).firstChild.nodeValue) {
				match = i;
			}
		}
	
		var coords = parser.getElementsByTagName( "coordinates" );
		var mycoords = coords.item(match).firstChild.nodeValue.split(",");

		var descs = parser.getElementsByTagName( "description" );
		
		var point = new GLatLng(mycoords[1], mycoords[0]);
		var myHtml = "<font face=\"Lucida Grande\"><b>" + mystring + "</b><br><font size = -1>" + descs.item(match).firstChild.nodeValue + "<br><b>Event:</b><br>"+myevent+"<br><i>"+mydesc+"</i></font></font>";
 		map.openInfoWindow(point, myHtml);
		
		document.getElementById("status").innerHTML=mystring+" "+descs.item(match).firstChild.nodeValue;

	}

      	google.setOnLoadCallback(initialize);


    </script>
	<script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAAYgIFcdB73ikjsshF47qFhRS5iu593tLKJPDuYHLhH0TP84lY7xSTiudEk5Ft8RkaPCYLgaUpxJcNaA"></script>

<script type="text/javascript">
<!--
google.load("gdata", "1");

function init() {
  google.gdata.client.init(handleGDError);
}

function padNumber(num) {
  if (num <= 9) {
    return "0" + num;
  }
  return num;
}



function handleGDError(e) {
  document.getElementById('jsSourceFinal').setAttribute('style', 
      'display:none');
  if (e instanceof Error) {
    /* alert with the error line number, file and message */
    alert('Error at line ' + e.lineNumber +
          ' in ' + e.fileName + '\n' +
          'Message: ' + e.message);
    /* if available, output HTTP error code and status text */
    if (e.cause) {
      var status = e.cause.status;
      var statusText = e.cause.statusText;
      alert('Root cause: HTTP error ' + status + ' with status text of: ' + 
            statusText);
    }
  } else {
    alert(e.toString());
  }
}

function listEvents(feedRoot) {
  	var entries = feedRoot.feed.getEntries();
  	var eventDiv = document.getElementById('events');
  	if (eventDiv.childNodes.length > 0) {
   	 	eventDiv.removeChild(eventDiv.childNodes[0]);
  	}	  
  	/* create a new unordered list */
  	var ul = document.createElement('ul');
  	/* set the calendarTitle div with the name of the calendar */
  	document.getElementById('calendarTitle').innerHTML = 
    	feedRoot.feed.title.$t+"'s <a href = \"#none\" onclick=\"popupCal()\">Calendar</a>";
  	/* loop through each event in the feed */
  	var len = entries.length;
	var insert_this="";
  	for (var i = 0; i < len; i++) {
    		var entry = entries[i];
    		var title = entry.getTitle().getText();
		var location = entry.getLocations();
		var why = entry.getContent();
    		var startDateTime = null;
    		var startJSDate = null;
    		var times = entry.getTimes();
    		if (times.length > 0) {
      			startDateTime = times[0].getStartTime();
      			startJSDate = startDateTime.getDate();
    		}
		var dateString = (startJSDate.getMonth() + 1) + "/" + startJSDate.getDate()+ " ";
    		if (!startDateTime.isDateOnly()) {
			if (startJSDate.getHours()<12) {
      				dateString += startJSDate.getHours() + ":" + padNumber(startJSDate.getMinutes()) + " AM";
			}
			else if (startJSDate.getHours()==12){
				dateString += startJSDate.getHours() + ":" + padNumber(startJSDate.getMinutes()) + " PM";
			}
			else {
				dateString += startJSDate.getHours()-12 + ":" + padNumber(startJSDate.getMinutes()) + " PM";
			}
    		}
		insert_this+="<b>"+title+"</b><br>" + dateString + " <a href=\"#none\" onmouseover='buildingLink(\"" + location[0].getValueString() + "\",\""+title+"\",\""+ why.getText() +"\")'>"+ location[0].getValueString() +"</a><br>";
  	}
	document.getElementById("events").innerHTML=insert_this;
}

google.setOnLoadCallback(init);
//-->
</script>
  


  </head>





  <body>

		<form>
	<br><br>
	<table border = "0" cellspacing = "0" cellpadding = "0"><tr>
	<td><div id="map" style="width: 700px; height: 480px"></div>
   		 <div id="searchcontrol"></div>&nbsp;&nbsp;
	</td>
	<td valign = "top" width = "100">
	<br><br>
       </select>
	</td></tr><tr>
	<td colspan = "2">



</td>
	</tr></table>
	</form>

  </body>

</html>